<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
    <style type="text/css">
    	*{margin:0;padding:0;}
    	body,html{width: 100%;height:100%;}
    </style>
</head>
<body>
    <div id="vbarChart" style="width:100%;height:100%;"></div>
    <script src="../../components/echarts-4.0.4.min.js"></script>
    <script>
        var vbarChart = echarts.init(document.getElementById('vbarChart'));
	    var barOption = {
	     	title: {
                text: '近12月专利总量趋势',
                left: 'center',
                top:'15%',
                textStyle: {
                    color: '#fff',
                    fontSize: 22
                }
            },
            backgroundColor:'#0A0F23',
		    color: ['#00ffff', '#00ffa2', '#f0e750'],
		    legend: {
		    	show:false,
		        left: "5%",
		        top:'15%',
		        itemGap: 20,
		        data: ['专利总量'],
		        textStyle: {
		            color: '#fff',
					fontSize: 16
		        }
		    },
			grid: {
			    left: '5%',
			    right: '7%',
			    bottom: '10%',
			    top:'25%',
			    containLabel: true
			},
		    radar: {
		        name: {
		            textStyle: {
		                color: '#fff',
		                backgroundColor: '#999',
		                borderRadius: 3,
		                padding: [3, 5]
		           }
		        },
		        center:['50%', '60%'],
		        radius: '45%',
		        indicator: [
		           { name: '发明申请', max: 6500},
		           { name: '发明授权', max: 16000},
		           { name: '实用新型', max: 30000},
		           { name: '外观设计', max: 38000}
		        ]
		    },
		    series: [{
		        name: '专利总量',
		        type: 'radar',
		        data : [
		            {
		                value : [4300, 10000, 28000, 35000, 50000, 19000],
		                name : '专利总量'
		            }
		        ]
		    }]
		};
        vbarChart.setOption(barOption);
    </script>
</body>
</html>